<style scoped lang="scss">
.contextmenu-container {
  position: fixed;
  width: 100px;
  min-height: 30px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 0 10px black;
  div {
    padding: 5px 10px;
    box-sizing: border-box;
    width: 100%;
    height: 30px;
    line-height: 20px;
    text-align: center;
    &:hover {
      background: rgb(194, 191, 191);
    }
  }
}
</style>
<template>
  <div class="contextmenu-container">
    <div v-for="menu in menus" @click="menu.fn()">
      {{ menu.name }}
    </div>
  </div>
</template>

<script setup>
import { defineProps } from 'vue'
const props = defineProps({
  menus: {
    type: Array,
    default: () => []
  }
})
</script>
